<template>
  <div id="" class="headerbox">
    <span class="backIcon" @click="goback()" v-show="hasBack">
      <img src="@/assets/arrow_left_white.png" alt="">
    </span>

    <h3>{{headerTitle}}</h3>
    <!-- 发布 icon -->
    <span class="shareIcon" @click="publish()" v-show="hasPublish">
      <img src="@/assets/publish_icon.png" alt="">
    </span>
    <!-- 添加 icon -->
    <span class="shareIcon" @click="addEvent()" v-show="addIcon">
      <img src="@/assets/myWallet/add_icon.png" alt="" width="20">
    </span>
    <!-- 扫描 icon -->
    <span class="shareIcon" @click="scanEvent()" v-show="scanIcon">
      <img src="@/assets/friendImage/sweep_icon.png" alt="" width="20">
    </span>
    <span class="shareIcon" @click="saveEvent()" v-show="saveForm">
      保存
    </span>
    <span class="shareIcon" @click="headerRightEvent()" v-show="headerRightTxt">
      {{headerRightTxt}}
    </span>
  </div>
</template>
<script>
export default {
  name: "",
  props: ['headerTitle','hasBack','hasPublish','addIcon','saveForm','scanIcon','headerRightTxt'],
  data: () => ({

  }),
  methods: {
    goback() {
      this.$router.go(-1);
    },
    // 发布,发表
    publish() {
      this.$emit('publishEvent',1);
    },
    // 明细
    showDetail() {
      this.$emit('showDetail',1);
    },
    // 发布
    publishActive() {
      this.$emit('publishActive',1);
    },
    // 添加
    addEvent() {
      this.$emit('addEvent',1);
    },
    // 扫描
    scanEvent() {
      this.$emit('scanEvent',1);
    },
    // 保存
    saveEvent() {
      this.$emit('saveEvent',1);
    },
    // 右边内容的点击
    headerRightEvent() {
      this.$emit('headerRightEvent',1);
    }
  }
}
</script>
<style lang="scss" scoped>
.headerbox{
  height: 40px;
  color: white;
  line-height: 40px;
  text-align: center;
  background: #0d7ce4;
  background: -webkit-linear-gradient(right bottom,#04a0fb,#0d7ce4);
	background: linear-gradient(right bottom,#04a0fb,#0d7ce4);
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 999;
  .backIcon,.shareIcon{
    position: absolute;
    left: 0px;
    top: 0px;
    padding:0 10px;
    img{
      width: 10px;
    }
  }
  .shareIcon{
    left: auto;
    right: 0px;
    img{
      width: 20px;
    }
  }
}
</style>
